<template>
	<div class="footer">
		<ul>
			<li>
				<router-link to="/layout/home">
					<i class="iconfont icon-zhuye"></i>
					首页
				</router-link>
			</li>
			<li>
				<router-link to="/layout/shopping">
					<i class="iconfont icon-shangcheng"></i>
					商城
				</router-link>
			</li>
			<li>
				<router-link to="/layout/service">
					<i class="iconfont icon-shenghuofuwu"></i>
					生活服务
				</router-link>
			</li>
			<li>
				<router-link to="/layout/mine">
					<i class="iconfont icon-yonghu"></i>
					我的
				</router-link>
			</li>
		</ul>
	</div>
</template>
<script>
	import "../assets/iconfont/iconfont.css"
	export default{
		name:'footerNav',
		data(){
			return{

			}
		}
	}
</script>
<style scoped lang="less">
	.footer{
		width: 100%;
		height: 50 / 50rem;
		background-color: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		border-top: 1/50rem solid #ff5555;
		ul{
			width: 95%;
			margin: 0 auto;
			display: flex;
			li{
				flex:1;
				font-size: 10/50rem;
				text-align: center;
				color: rgba(0, 0, 0, 0.8);
				// opacity: 0.8;
				i{
					display: block;
					margin-top: 6/50rem;
					font-size: 18/50rem;
					margin-bottom: 5/50rem;
				}
			}
		}
	}
	.active{
		color: #ff5555;
	}
</style>